<template>

    <div>
        <PersButton :title="客户邀请状态" :height="'100%'" :width="'100%'"></PersButton>

        <div class="content">
            <el-table align="center" :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="id" border
                stripe default-expand-all v-loading="loading" @selection-change="handleSelectionChange" height="800">
                <el-table-column align="center" fixed header-align="center" prop="date" width="150"
                    label="日期"></el-table-column>
                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100" label="场次">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span style="font-size: 8pt;">{{ scope.row.venue1.name }}</span>
                            <span style="font-size: 8pt;">{{ scope.row.venue2.name }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="领课加V数">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.lingke_jiav.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.lingke_jiav.num }}</span>
                            <span @click="chakan(scope.row.venue2.lingke_jiav.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.lingke_jiav.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="已邀约数">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yiyaoyue.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yiyaoyue.num }}</span>
                            <span @click="chakan(scope.row.venue2.yiyaoyue.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yiyaoyue.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="未邀约数">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.weiyaoyue.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.weiyaoyue.num }}</span>
                            <span @click="chakan(scope.row.venue2.weiyaoyue.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.weiyaoyue.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约已到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_yidaoke.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_yidaoke.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_yidaoke.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_yidaoke.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约1次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke1.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke1.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke1.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke1.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约2次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke2.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke2.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke2.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke2.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约3次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke3.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke3.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke3.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke3.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约4次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke4.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke4.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke4.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke4.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约5次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke5.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke5.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke5.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke5.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约6次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke6.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke6.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke6.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke6.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约7次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke7.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke7.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke7.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke7.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约8次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke8.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke8.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke8.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke8.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约9次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke9.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke9.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke9.user)" style="font-size: 8pt;">{{
                                scope.row.venue2.yaoyue_weidaoke9.num }}</span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column align="center" fixed header-align="center" prop="wx_avatarurl" width="100"
                    label="邀约10次未到课">
                    <template slot-scope="scope">
                        <div class="content_view">
                            <span @click="chakan(scope.row.venue1.yaoyue_weidaoke10.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke10.num }}</span>
                            <span @click="chakan(scope.row.venue2.yaoyue_weidaoke10.user)" style="font-size: 8pt;">{{
                                scope.row.venue1.yaoyue_weidaoke10.num }}</span>
                        </div>
                    </template>
                </el-table-column>


            </el-table>
            <div class="block">
                <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page="pageNumber" :page-sizes="[10, 50, 100, 200]" :page-size="pageSize" background
                    layout="total, sizes, prev, pager, next, jumper" :total="total">
                </el-pagination>
            </div>
        </div>


    </div>
</template>

<script>

let _that;
import { getStatusList } from '@/api/live/invitation';
import PersButton from '@/components/PersButton';
export default {
    components: {
        PersButton
    },
    data() {
        return {
            loading: false,
            tableData: [],
            pageSize: 10, //一页显示多少条
            pageNumber: 1,
            total: 0, //总页数
        }
    },
    created() {
        _that = this;
        this.init();
    },
    methods: {
        init() {
            _that.loading = true;
            let _param = {
                pageNumber: this.$pageNumber,
                pageSize: this.$pageSize,
            }

            getStatusList(_param).then((res) => {
                console.log(res);
                _that.tableData = res.data;
                _that.tableData = res.data;
            })

        }


    }

}
</script>


<style>
.content {
    width: 100%;
}

.content_view {
    width: 100%;
    ;
}
</style>